<template>
    <view>
        <u-popup :show="true" @close="close" mode="center" :round="10" closeable :closeOnClickOverlay="false">
            <view class="topUp">
                <text class="row j-centert black size30 bold">充值{{ Unit }}前请确认账户是否正确</text>
                <input
                    type="digit"
                    class="placeInput"
                    v-model="money"
                    placeholder=" 请输入充值金额"
                    v-if="Type == 'money'" />
                <input
                    type="number"
                    class="placeInput"
                    v-model="money"
                    placeholder=" 请输入充值积分"
                    v-if="Type == 'jifen'" />
                <view class="popfot">
                    <view class="list Cancel" @click="close">取消充值</view>
                    <view class="list white" :class="money ? 'active' : 'bg66'" @click="Continue">立即充值</view>
                </view>
            </view>
        </u-popup>
    </view>
</template>

<script>
    export default {
        props: ['vid', 'Type'],
        data() {
            return {
                money: '',
            }
        },
        methods: {
            close() {
                this.$emit('hideTopUp')
            },
            Continue() {
                if (!this.money) return
                let Url
                if (this.Type == 'money') Url = '/singleSaleManageApi/rechargeMoney'
                if (this.Type == 'jifen') Url = '/singleSaleManageApi/rechargeJifen'
                const requestData = {
                    v_id: this.vid,
                    down_v_id: this.vid,
                    money: this.money,
                    shop_id: uni.getStorageSync('store_id'),
                }
                this.$http
                    .post({
                        url: Url,
                        data: requestData,
                    })
                    .then((res) => {
                        if (res.errcode != '100') return this.$Toast(res.msg)
                        this.$Toast(res.msg)
                        this.close()
                        this.$emit('Continue')
                    })
            },
        },
        computed: {
            Unit() {
                if (this.Type == 'money') return '余额'
                if (this.Type == 'jifen') return '积分'
            },
        },
    }
</script>

<style lang="scss" scoped>
    .topUp {
        width: 690rpx;
        padding: 50rpx 24rpx 40rpx 24rpx;
    }

    .placeInput {
        width: 100%;
        height: 100rpx;
        border: 1px solid #ccc;
        border-radius: 10rpx;
        margin-top: 34rpx;
        text-align: center;
        font-size: 32rpx;
        color: #000;
    }

    .popfot {
        width: 100%;
        display: flex;
        justify-content: space-between;
        margin-top: 30rpx;
    }
    .list {
        width: 300rpx;
        height: 82rpx;
        border-radius: 10rpx;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 30rpx;
    }
    .Cancel {
        background-color: #ccc;
    }
    .active {
        background-color: #006633;
    }
</style>
